{% extends "base.html" %}
{% load static %}



{% block title %}Generate Flux Diagram{% endblock %}

{% block extrahead %}

<script type="text/javascript">
$().ready(function() {
        // Show a loading animation when after hitting the submit button before the video is created.
        $('[id$=submit]').click(function() {
            $('#loading_image').show();
            $('#videos').hide();
            $('.error').hide();
        });
});
</script>

{%endblock%}

{% block navbar_items %}
<li><a href="{% url 'rmg:index' %}">RMG Tools</a></li>
<li><a href="{% url 'rmg:generate-flux' %}">Generate Flux Diagram</a></li>
{% endblock %}

{% block sidebar_items %}
{% endblock %}

{% block page_title %}Generate Flux Diagram{% endblock %}

{% block page_body %}

<p>
<P>Generate a Flux Diagram either by simulating the conditions of an RMG job
    with the optional customized set of concentration profiles from a Chemkin job.
<P>You will require at least 3 files to generate a video.  For a RMG-Py job, you will require the
    input.py file, chem.inp chemkin mechanism, and species_dictionary.txt dictionary file.
    Similarly, for a RMG-Java job, you will require the condition.txt file, chem.inp file, and
    RMG_dictionary.txt file.  The server will then simulate the isothermal conditions
    for each reaction system specified in your condition or input file and draw flux diagrams
    for each iteration, then piece them together into a video .avi file.
<P>In order to generate a flux diagram video for a non-isothermal simulation, simply upload
    the .out file associated with a chemkin simulation output for a shock tube or RCM, etc.  Use
    the .out file containing species concentrations.
<hr/>
<img src="{% static 'img/loading.gif' %}" alt="Loading..." style="display:none" id="loading_image">
<P>
{% if error_message %}
<div>
    <p>
        <div class="error">
            <strong>Got an error while generating flux diagram:</strong><br>
            {{ error_message | safe }}
        </div>
    </p>
</div>
{% endif %}
{% if path %}
<div id="videos">
<b>Generated Videos for Reaction Systems</b>
<ol>
{% for item in path %}
<li><a href ="{{  MEDIA_URL }}rmg/tools/flux/flux/{{item}}/flux_diagram.avi">Flux Diagram Video</a>
{% endfor%}
</ol>
</div>
<hr />
{% endif %}

<form enctype="multipart/form-data" action="" method="POST" id="upload">{% csrf_token %}


<P><b>RMG Input File:</b> {{form.input_file}}
<P><b>Chemkin File:</b> {{form.chem_file}}
<P><b>RMG Dictionary:</b> {{form.dict_file}}
<P><b>Chemkin Output File (Optional):</b> {{form.chem_output}}
<P><b>From RMG-Java:</b> {{form.java}}

<table width="80%" align="center"><tr><td>
<p><h3>Advanced Options</h3>
   <P><b>Maximum Nodes:</b>{{form.max_nodes}}
<br>The maximum number of species desired in the flux diagram
<P><b>Maximum Edges:</b>{{form.max_edges}}
<br>The maximum number of connections desired.
<P><b>Multiplicative Time Step Factor:</b> {{form.time_step}}
<P><b>Concentration Tolerance:</b> {{form.concentration_tol}}
<br>The lowest fractional concentration of any species to show (species which never reach concentrations above this will not appear in the flux diagram.)  The fractional concentration = concentration / maximum concentration of any species throughout simulation.
<P><b>Species Rate Tolerance:</b> {{form.species_rate_tol}}
<br>The lowest fractional species rate to show (species which have rates of production below this value will not have flux arrows drawn.) The fractional species rate = rate of production/ maximum rate of production any species throughout simulation.
</td></tr>
</table>


<p><input type="submit" value="Submit" id="submit"/></p>
</form>

{% endblock %}
